import { NavBar } from "antd-mobile";
import { useNavigate, useParams } from "react-router-dom";
import { useEffect, useState } from "react";
import { detailGet } from "../../api/course";
import { CourseType } from "../../types/course";
export interface IDetailProps {}

export default function Detail(props: IDetailProps) {
  const navigate = useNavigate();
  const params = useParams(); //提取动态路由参数
  // console.log("路由参数", params);
  let [data, setData] = useState<CourseType>();
  useEffect(() => {
    detailGet(params.id as string).then((res) => {
      console.log(res);
      setData(res.data);
    });
  }, []);
  const back = () => {
    navigate(-1);
  };
  return (
    <div>
      <NavBar onBack={back}>详情</NavBar>
      <div dangerouslySetInnerHTML={{ __html: data?.intro! }}></div>
      <div dangerouslySetInnerHTML={{ __html: data?.detail! }}></div>
    </div>
  );
}
